<!DOCTYPE html>
<html>

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>华猫商城</title>
		<style></style>
		<!--<link href="../css/jquery.validator.css" rel="stylesheet">-->
		<link href="../css/common.css" rel="stylesheet">

		<link href="../plugin/userLib/css/user.css" rel="stylesheet">
		<link href="../plugin/userLib/css/userinfo.css" rel="stylesheet">
		<link href="../plugin/userLib/css/my_user.css" rel="stylesheet">
		<link href="../css/base.css" rel="stylesheet">
		<link href="../plugin/userLib/css/shop.css" rel="stylesheet">
		<link href="../plugin/userLib/css/shop_a.css" rel="stylesheet">
		<!--<link href="../plugin/webuploader/webuploader.css" rel="stylesheet">
		<link href="../plugin/webuploader/batchupload.css" rel="stylesheet">
		<link href="../plugin/kindeditor/themes/default/default.css" rel="stylesheet">-->
		<style>
			select{
				padding-right: 20px !important;
			}
			.ZZHT-content{
				font-size:13px;
			}
			.goodsLogo img{
				width:70px;
				height:70px;
				vertical-align: text-top;
			}
			.ZZHT-list tbody tr{
				border-bottom:1px solid #eee;
			}
			.ZZHT-list tbody tr td{
				line-height: 38px !important;
				padding:10px;
				vertical-align: top;
				color:#000;
			}
			.ZZHT-list tbody tr td:nth-child(2) div{
				border-right:1px solid #eee;
			}
			.ZZHT-list thead tr th{
				padding-left:18px;
				background:transparent !important;
				border-bottom: 1px solid #000!important;
			}
			.reply_area{
				width: 85%;
			    height: auto;
			    margin-left: 0;
			    min-height: 99px;
			    border-radius: 10px;
			    border:1px solid #eee;
			    margin-top:15px;
			    padding:10px;
			}
			.reply_btn{
				float:right;
				padding:8px 25px;
				color:#fff;
				background-color:#EA5404;
				border:none;
				border-radius:4px;
				margin-right:10%;
				cursor: pointer;
				margin-top:10px;
			}
		</style>
	</head>

	<body>
		<div id="header"></div>
		<div id="headerBox"></div>
		<!--<div id="nav_menu"></div>-->
		<div class="ZZHT-wrap">
			<div class="ZZHT-header" style="border-bottom: 1px solid #ffffff;">
				<div class="ZZHT-shop-nav">
					<div class="ZZHT-nav-box">
						<a href="#">
							<li class="liselect ZZHT-lfloat ZZHT-nav-boxa">商城商家</li>
						</a>
						<div class="ZZHT-clear"></div>
					</div>
				</div>
				<div class="ZZHT-clear"></div>
			</div>
			<div class="ZZHT-main">
				<div id="onLine_left"></div>
				<div class="ZZHT-content">

					<div class="ZZHT-user-head clearfix"><span class="left fl">评价管理</span><span class="rights fr">当前位置：商品管理--评价管理</span></div>
					<div class="search-wrap">
						<form class="search-form" name="form">
							<label>
            商品分类：
             <select name="shopCatId1" id="shopCatId1" class="s-query" v-model="cat1">
                					<option value="">-请选择-</option>
                                  	<option :value="v.catId" v-for="v in menu" v-if="v.parentId=='0'">{{v.catName}}</option>
                          		</select>
            					<select name="shopCatId2" id="shopCatId2" class="s-query">
            						<option value="">-请选择-</option>
            						<option :value="v.catId" v-for="v in menu" v-if="cat1 && (v.parentId == cat1)">{{v.catName}}</option>
            					</select>
        </label>
							<a href="javascript:;" class="btn-inquire" onclick="goodsByPage()"><i class="icon-search"></i></a>
						</form>
					</div>
					<div class="ZZHT-shop-content">
						<table class="ZZHT-list ZZHT-lists">
							<thead>
								<tr>
									<th width="40">序号</th>
									<th width="400">商品</th>
									<th width="500" style="text-align: center;">回复评论</th>
								</tr>
							</thead>
							<tbody id="list">
								<tr v-for="(v,i) in tab">
									<td>{{i+1}}</td>
									<td width="400">
										<div class="goodsLogo">
											<a :href='"../view/detail.html?goodsId="+v.goodsId'> 
												<img class="j-lazyGoodsImg" v-if="v.goodsImg.substr(0,4)=='http'" :src='v.goodsImg' style="display: inline;">
												<img class="j-lazyGoodsImg" v-else :src='"http://zzhtwl.oss-cn-qingdao.aliyuncs.com/"+v.goodsImg' style="display: inline;"> 
											</a>
											<span>{{v.goodsName}}</span>
										</div>
										<div>商品评价：<img v-for="item in v.appraises[0].goodsScore" src="../plugin/userLib/img/star-on.png"></div>
										<div>服务评价：<img v-for="item in v.appraises[0].serviceScore" src="../plugin/userLib/img/star-on.png"></div>
										<div>时效评价：<img v-for="item in v.appraises[0].timeScore" src="../plugin/userLib/img/star-on.png"></div>
									</td>
									<td>
										<p>{{v.appraises[0].loginName}}：<span style="color:#aaa">{{v.appraises[0].content}}</span></p>
										<textarea class="reply_area" :placeholder='"回复"+v.appraises[0].loginName' v-model='v.appraises[0].shopReply'></textarea>
										<div>
											<button class="reply_btn" @click="reply(v.appraises[0].id,v.appraises[0].shopReply)">回复</button>
										</div>
									</td>
								</tr>
							</tbody>
						</table>
					</div>
					<div style="text-align: center;" id="pager"></div>
				</div>
			</div>
			<div style="clear:both;"></div>
			<br>
		</div>
		<div id="ck3"></div>
		<script src="../js/jquery.min.js"></script>
		<script src="../js/vue.min.js"></script>
		<script type="text/javascript" src="../js/ljf_base.js"></script>
		<script type="text/javascript" src="../js/common.js"></script>
		<script type="text/javascript" src="../js/common_view.js"></script>
		<script src="../plugin/layer/layer.js"></script>
		<script src="../plugin/userLib/js/online_goodsList.js"></script>
		<script>
			var search_data = {};
			var pages = 1;
			var pageNum = 1;
			var shopId = '';//店铺Id
			
			initPage();
			
			$(function(){
				init();
			})
			
			var vm = new Vue({
				el: '.ZZHT-content',
				data: {
					tab: [],
					checkArr: [], //被选中的goodsid 列表
					menu:[],//店铺两级分类
					cat1:'',//当前选择的第一级分类
				},
				methods: {
					reply:function(id,text){
						if(text){
							$.ajax({
								type: "get",
								url: SURL + "goods/backByAppraises",
								data: {
									"shopReply":text,
									"id":id
								},
								dataType: 'json',
								success: function(res) {
									layer.msg(res.message);
								}
							});
						}else{
							layer.msg('请输入要回复的内容');
						}
						
					}
				}
			});
			
			function getList() {
				var url = "goods/selectByAppraises";//接口地址
				
				var data = $.extend(true,{},search_data);
				
				getListByUrl(url,data)
			};
		</script>
		</script>
	</body>

</html>